<template>
	<view>
		<u-upload style="background-color: #ff0000;" width="60" height="60" :fileList.sync="fileList" @delete="deletePic" name="1" multiple :maxCount="config.maxCount"
		:sizeType="config.sizeType" @afterRead="afterRead" :max-size="config.maxSize"
		 :limitType="config.limitType" @oversize="oversize"
		:previewFullImage="true">
		</u-upload>
	</view>
</template>

<script>
	var self, mapCtx, qqmapsdk;
		const COS = require('cos-wx-sdk-v5');
	import QQMapWX from '../utils/qqmap-wx-jssdk'
	export default {
		name: "my-login",
		props: {
			showlogin: {
				type: Boolean,
				default: false
			},
			config:{
				type:Object,
				default:{
					sizeType: ['compressed'],
					limitType: ['png', 'jpg', 'jpeg'],
					fileMaxSize: 1 * 1024 * 1024,
					maxSize: 20 * 1024 * 1024,
					fileMinSize: 5 * 1024,
					maxCount:6,
					previewFullImage:true
				}
			},
			uploadParams:{
				type:Object,
				default:{

				}
			},



		},
		data() {
			return {
				fileList:[],// 图片列表
			};
		},
		mounted() {

		},
		beforeDestroy() {
			// console.log('my-login beforeDestroy')
		},
		methods: {
			// // 删除图片
			deletePic(event) {
				this[`fileList`].splice(event.index, 1)
				// console.log(this.fileList1)
			},
			// 读取图片
			async afterRead({file}) {
				let _this = this
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				// _this.$common.upload({
				// 	url:'', // 上传接口地址
				// 	params:_this.uploadParams, // 传递参数
				// 	imageListName:'fileList',
				// 	_this,
				// 	event,
				// 	limitType:_this.config.limitType,
				// 	fileMaxSize:_this.config.fileMaxSize,
				// 	maxSize:_this.config.maxSize,
				// 	fileMinSize:_this.config.fileMinSize,
				// 	fileListLen:_this[`fileList`].length,
				// 	list:[].concat(event.file)
				// })
				const cos = new COS({
					SecretId: 'AKIDDKRWo9cAkIvz0ptpZFl4sjUD55xdJrW7',
					SecretKey: 'd5LRK1WotmU0JiDYhePyKfp5KPL9mJhu',
				});
				file.forEach(file => {
					const filePath = file.url
					uni.getFileSystemManager().readFile({
						filePath: filePath,
						success: (res) => {
							cos.putObject({
							    Bucket: 'lyg-1254016590', // 存储桶名称
							    Region: 'ap-nanjing', // 区域
							    Key: '/dev-test/' + Date.now() + '-' + Math.random().toString(36).substr(2, 8), // 文件路径及名称
							    Body: res.data,
							    onProgress: (progressData) => {
							        console.log('进度:', JSON.stringify(progressData));
							    }
							    }, (err, data) => {
							        if (err) {
							          console.error('上传失败:', err);
							        } else {
							          console.log('上传成功:', data);
									  this.fileList.push({
										  url: 'https://'+ data.Location
									  })
							        }
							      });
						},
						fail: (error) => {
							console.error('读取文件失败:', error);
						}
					});
				})

			},
		}
	}
</script>

<style lang="scss">
	.upopupbox {
		width: 700rpx;
		padding-bottom: 60rpx;
		margin-top: -8px;

		.titlebox {
			font-size: 14px;
			display: flex;
			justify-content: center;
		}

		.avatar {
			margin-top: 20px;
			width: 60px;
			height: 60px;
			border-radius: 60px;
			padding: 0;
			background: none;

			image {
				width: 60px;
				height: 60px;
				border-radius: 60px;
			}
		}

		.nickbox {
			margin-top: 20rpx;
			margin-bottom: 20rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			color: #545454;

			text {
				margin-left: -100rpx;
				margin-right: 10px;
			}

			input {
				background-color: #f8f6fc;
				width: 140px;
				padding: 4px;
				text-align: center;
			}
		}

		.tipsbox {
			background-color: #fafafa;
			color: #545454;
			width: 80%;
			margin-left: 10%;
			padding: 6px;
			font-size: 12px;
		}

		.privacybox {
			color: #545454;
			width: 80%;
			margin-left: 10%;
			padding: 6px;
			font-size: 12px;
			margin-top: 20rpx;
			margin-bottom: 20rpx;

			.agreeclass {
				color: #534EA1;
			}
		}

		.buttonbox {
			margin-bottom: 10rpx;
			background: -webkit-linear-gradIEnt(left,#6C64D0,#8481C8)!important;
		}
	}

</style>
